<template>
  <view class="login">
    <view class="title">
      <view>您好，</view>
      <view>欢迎来到惠通金融</view>
    </view>
    <form class="form">
      <view class="input">
        <input
          placeholder="请输入账号"
          v-model="data.userTel"
          @change="verify(data.userTel)"
        />
      </view>
      <text>{{ txt }} </text>
      <view class="password">
        <input placeholder="请输入密码" v-model="data.userPad"  password/>
      </view>
      <view class="radio">
        <label class="radio">
          <radio style="transform: scale(0.8)" color="red">我已阅读</radio>
          <span><text @click="policy">《惠通金融隐私政策》</text></span>
        </label>
      </view>
      <button
        class="btn"
        type="warn"
        @click="loginHandler(data)"
        :disabled="disabled"
      >
        登录
      </button>
      <text>{{ txt2 }} </text>
    </form>
    <view class="tips">
      <view class="check">验证码登录</view>
      <view class="regi">
        <view>忘记密码</view>
        <view @click="toRegister">注册</view>
      </view>
    </view>
  </view>
</template>

<script>
import { createNamespacedHelpers } from "vuex";
const { mapActions } = createNamespacedHelpers("user");
export default {
  data() {
    return {
      data: { userTel: "", userPad: "" },
      txt: "",
      disabled: 0,
      txt2: "",
    };
  },
  methods: {
    ...mapActions(["login", "telNumberChecking"]),
    //登录
    async loginHandler(data) {
      console.log(data);
      const value = await this.login(data);
      console.log(value, "登录shouye");
      if (value.code == 10001 && value.data) {
        uni.setStorageSync("token", value.data);
        uni.switchTab({
          url: "/pages/index/index",
        });
      } else {
        this.txt2 = value.msg;
      }
    },
    // 检查号码是否注册
    async verify(userTel) {
      const data = await this.telNumberChecking(userTel);
      console.log(data);

      if (data.code == 10010) {
        (this.txt = "手机号码必须为11位"), (this.disabled = 1);
      } else {
        if (data.code == 10002) {
          (this.txt = ""), (this.disabled = 0);
        } else {
          (this.txt = "手机号码未注册，请注册"), (this.disabled = 1);
        }
      }
    },

    //注册
    toRegister() {
      uni.navigateTo({
        url: "../register/register",
      });
    },
    //金融隐私政策
    policy() {
      uni.navigateTo({});
    },
  },
};
</script>

<style lang="scss" scoped>
.login {
  height: 100vh;
  background-color: #fafafa;
  padding: 40rpx;
  box-sizing: border-box;
  .title {
    height: 15%;
    font-size: 50rpx;
    view {
      margin: 20rpx 0rpx;
    }
  }
  .form {
    .input {
      height: 100rpx;
      background-color: #ffffff;
      margin: 30rpx 0rpx;
      line-height: 80rpx;
      border-radius: 10rpx;
      input {
        height: 100%;
      }
    }
    .password {
      height: 100rpx;
      background-color: #ffffff;
      margin: 30rpx 0rpx;
      border-radius: 10rpx;
      input {
        height: 100%;
      }
    }
    .radio {
      margin-bottom: 20rpx;
      color: #9e9e9f;
      ._span {
        color: red;
        // font-size:24rpx;
      }
    }
    button {
      margin-bottom: 20rpx;
    }
  }
  .tips {
    width: 100%;
    // display:flex;
    // justify-content: space-around;
    .check {
     width: 100%;
      float: left;
      color: #9e9e9f;
    }
    .regi {
      float: right;
      display: flex;
      view {
        margin-left: 30rpx;
      }
      view:first-child {
        color: #9e9e9f;
      }
    }
  }
}
</style>
